<template>
    <view class="container1">
        <view class="storeHead1">
            <view class="flex align-center">
                <view class="cuIcon-back text-white margin-right-xs" style="font-size:40upx" @click="navBack"></view>
                <view class="searchBox flex align-center" style="height: 32px;">
                    <text class="iconfont icon-search"></text>
                    <input type="text" confirm-type="search" style="margin-left: 5px;width: 100%;"
                        ceholder-style="color:#C5C5C5" placeholder="搜索店内商品" />
                </view>
            </view>
        </view>
        <view class="contentBox1">
            <view class="storeInfoBox1">
                <view class="logoPic1 bgc"></view>
                <view>
                    <view class="storeName1 bgc"></view>
                    <view class="tafactory_psqy1 bgc"></view>
                </view>
            </view>
            <view class="content1 flex">
                <view class="leftBox1 bgc"></view>
                <view class="rightBox1">
                    <view class="tabBox1 flex align-center justify-between">
                        <template v-for="item in 4">
                            <view class="tabItem1 bgc"></view>
                        </template>
                    </view>
                    <template v-for="item in 4">
                        <view class="goodBox1">
                            <view class="goodPic1 bgc"></view>
                            <view class="goodDetail1">
                                <view class="bgc" style="width: 100%;height: 32upx;margin-bottom: 16upx;"></view>
                                <view class="bgc" style="width: 260upx;height: 36upx;margin-bottom: 16upx;"></view>
                                <view class="flex align-center justify-between" style="margin-bottom: 16upx;">
                                    <view class="bgc" style="width: 112upx;height: 36upx;"></view>
                                    <view class="bgc" style="width: 140upx;height: 36upx;"></view>
                                </view>
                                <view class="bgc" style="width: 300upx;height: 32upx;margin-bottom: 16upx;"></view>
                                <view class="bgc" style="width: 300upx;height: 32upx;margin-bottom: 16upx;"></view>
                            </view>
                        </view>
                    </template>
                </view>
            </view>
        </view>
    </view>
</template>

<script>
</script>

<style scoped lang="scss">
    .container1 {
        width: 100vw;
        height: 100vh;
        overflow: hidden;
    }

    .bgc {
        background-color: #F5F6F7;
    }

    .storeHead1 {
        width: 100%;
        height: 210upx;
        z-index: 1;
        background: linear-gradient(135deg, #05a868, #00ce8c);
        padding: 0 24upx 24upx 24upx;
        padding-top: 40px;

        .searchBox {
            background: #ffffff;
            border-radius: 32upx;
            padding: 0 24upx;
            width: 100%;
            position: relative;
            z-index: 103;

            .iconfont {
                color: rgba(35, 35, 35, 0.18);
                font-size: 40upx;
            }

            input {
                font-size: 13px;
                font-family: PingFang SC, PingFang SC-Regular;
                font-weight: 400;
                text-align: left;
                color: #2a2a2a;
            }
        }
    }

    .contentBox1 {
        border-radius: 24upx 24upx 0px 0px;
        background: #FFFFFF;
        height: calc(100% - 190upx);
        position: relative;
        top: -20upx;

        .storeInfoBox1 {
            height: 130upx;
            width: 100%;
            border-bottom: 1px solid #f2f2f2;
            padding: 12upx 30upx 0 184upx;
            position: relative;

            .logoPic1 {
                width: 124upx;
                height: 124upx;
                position: absolute;
                left: 30upx;
                top: -24upx;
                border-radius: 16upx;
            }

            .storeName1 {
                height: 44upx;
                width: 400upx;
            }

            .tafactory_psqy1 {
                height: 22upx;
                margin-top: 16upx;
                width: 200upx;
            }
        }

        .content1 {
            width: 100%;
            height: calc(100% - 130upx);

            .leftBox1 {
                flex-shrink: 0;
                width: 152upx;
                height: 100%;
            }

            .rightBox1 {
                flex: 1;
                height: 100%;
                padding: 32upx 24upx 0;

                .tabBox1 {
                    margin-bottom: 32upx;

                    .tabItem1 {
                        width: 112upx;
                        height: 48upx;
                        border-radius: 24upx;
                    }
                }

                .goodBox1 {
                    margin-bottom: 32upx;
                    padding-left: 194upx;
                    position: relative;

                    .goodPic1 {
                        width: 176upx;
                        height: 176upx;
                        position: absolute;
                        top: 0;
                        left: 0;
                    }
                }
            }
        }
    }
</style>
